<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8" isELIgnored="false"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<base href="<%=basePath%>">
	<link rel="stylesheet" href="css/ztree.css" />
	<script src="js/jquery.min.js"></script>
	<script src="js/ztree.js"></script>
<script type="text/javascript">
var roleid='${role_id}';
var setting = {
		check: {
			enable: true
		},
		data: {
			simpleData: {
				enable: true
			}
		}
	};
	var zNodes=${menus}

// 	var zNodes =[
// 		{ id:1, pId:0, name:"随意勾选 1", open:true},
// 		{ id:11, pId:1, name:"随意勾选 1-1", open:true},
// 		{ id:111, pId:11, name:"随意勾选 1-1-1"},
// 		{ id:112, pId:11, name:"随意勾选 1-1-2"},
// 		{ id:12, pId:1, name:"随意勾选 1-2", open:true},
// 		{ id:121, pId:12, name:"随意勾选 1-2-1"},
// 		{ id:122, pId:12, name:"随意勾选 1-2-2"},
// 		{ id:2, pId:0, name:"随意勾选 2", checked:true, open:true},
// 		{ id:21, pId:2, name:"随意勾选 2-1"},
// 		{ id:22, pId:2, name:"随意勾选 2-2", open:true},
// 		{ id:221, pId:22, name:"随意勾选 2-2-1", checked:true},
// 		{ id:222, pId:22, name:"随意勾选 2-2-2"},
// 		{ id:23, pId:2, name:"随意勾选 2-3"}
// 	];
var zTree;
	function setCheck() {
	zTree = $.fn.zTree.getZTreeObj("treeDemo"),
		type = { "Y": "ps", "N": "ps"};
		zTree.setting.check.chkboxType = type;
	}
	
	$(document).ready(function(){
		$.fn.zTree.init($("#treeDemo"), setting, zNodes);
		setCheck();
	});
	function submit(){
		var selectedNode = zTree.getCheckedNodes();
		
		var mynodes=new Array();
		selectedNode.forEach(function(i,index){
			var node={"id":i.id,"pId":i.pId,"checked":i.checked,"open":i.open,"name":i.name};
			mynodes.push(node);
		})
		$.ajax({
			url : "<%=request.getContextPath()%>"
			+ '/role/insertRoleMenu',
			type : "get",
			data:{"nodes":JSON.stringify(mynodes),"role_id":roleid},
			contentType : "application/json",
			async : false,
			success : function(data) {
				alert("权限已修改！")
			},
			error : function(data){	
			}});
	}
</script>
</head>
<body>
<div>${role_name}<ul id="treeDemo" class="ztree" style="height:auto"></ul><button onclick="submit()" class="btn btn-default btn_submit" style="float:right;margin-right:20px;margin-bottom:20px">提交</button></div>
</body>
</html>